<template>
    <div class="container">
        <div class="searchMy">
            <el-upload class="upload-demo" :before-upload="beforeUpload" action :show-file-list="false" :http-request="httpRequest" :multiple="false" accept=".xls,.xlsx">
                <el-button size="mini" type="primary"> <svg-icon icon-class="upload" /> 导入</el-button>
            </el-upload>
            <div class="tbImg" @click="go('wdtb')">
                <img src="@/assets/images/u3365.png" alt="">
            </div>
        </div>
        <!-- <div class="btn">
            <el-upload class="upload-demo" :before-upload="beforeUpload" 
            action  :show-file-list="false" :http-request="httpRequest"
             :multiple="false" accept=".xls,.xlsx">
                <el-button size="mini" type="primary"> <svg-icon icon-class="upload" /> 导入</el-button>
            </el-upload>
        </div> -->
        <div class="table-list">
            <div style="padding:7px;" class="kplist">
                <span></span>
                <span>制表单位：万元</span>
            </div>

            <el-table v-loading="loading" :data="tableDatas" fit style="width: 100%" :height="$store.state.app.windowHeight - 212">
                <el-table-column label="基本情况">
                    <el-table-column type="index" label="序号" width="60" align="center" :index="currIndex">
                    </el-table-column>

                    <el-table-column prop="ds" label="地市" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="rwnd" label="任务所属年度" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="fxly" label="风险计划类型" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="qylx" label="企业类型" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="nsrmc" label="纳税人名称" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="nsrsbh" label="纳税人识别号" width="200" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="hy" label="行业" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="ssjt" label="所属集团（千户集团）" width="200" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="jtsshy" label="集团所属行业" width="200" align="center" show-overflow-tooltip>
                    </el-table-column>
                </el-table-column>
                <el-table-column label="已入库税款部分" show-overflow-tooltip>

                    <el-table-column prop="sfjsftc" label="是否经数风统筹" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="sfywc" label="是否已完成" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="sffxrwmc" label="数风风险任务名称" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="fxglsjhj" label="风险管理涉及环节" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="fxly" label="风险来源" width="150" align="center" show-overflow-tooltip> 
                    </el-table-column>
                    <el-table-column prop="fxdmc" label="风险点名称" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="fxms" label="风险描述" width="250" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="rkyf" label="入库月份" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="rkskhj" label="入库税款合计" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="znjhj" label="滞纳金合计" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>

                    <el-table-column prop="tzynssde" label="调增应纳税所得额" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="tjzzsld" label="调减增值税留抵" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column label="增值税">
                        <el-table-column prop="zzsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="zzsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="zzsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="消费税">
                        <el-table-column prop="xfsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="xfsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="xfsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="企业所得税">
                        <el-table-column prop="qysdsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="qysdsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="qysdsZnj" label="滞纳金" width="150" align="center"  show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="个人所得税">
                        <el-table-column prop="grsdsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="grsdsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="grsdsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="契税">
                        <el-table-column prop="qsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="qsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="qsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="车船税">
                        <el-table-column prop="ccsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="ccsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="ccsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="车辆购置税">
                        <el-table-column prop="clgzsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="clgzsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="clgzsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="城市维护建设税">
                        <el-table-column prop="cswhjssRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="cswhjssSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="cswhjssZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="印花税">
                        <el-table-column prop="yhsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="yhsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="yhsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="土地增值税">
                        <el-table-column prop="tdzzsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="tdzzsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="tdzzsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="耕地占用税">
                        <el-table-column prop="gdzysRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="gdzysSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="gdzysZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="资源税">
                        <el-table-column prop="zysRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="zysSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="zysZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="城镇土地使用税">
                        <el-table-column prop="cztdsysRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="cztdsysSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="cztdsysZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="环境保护税">
                        <el-table-column prop="hjbhsRksk" label="入库税款" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="hjbhsSkssq" label="税款属期" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column prop="hjbhsZnj" label="滞纳金" width="150" align="center" show-overflow-tooltip>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column prop="jyffj" label="教育费附加" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="qtsf" label="其他税费" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="rkDbsj" label="入库（调表时间）" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="rkpzhm" label="入库凭证号码" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="bz" label="备注" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                </el-table-column>

                <el-table-column label="统计周期次月预计入库税款部分">
                    <el-table-column prop="yjrkskje" label="预计入库税款金额" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="ssjtYj" label="所属集团" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="jtsshyYj" label="集团所属行业" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="qylxYj" label="企业类型" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="bzYj" label="备注" width="150" align="center" show-overflow-tooltip>
                    </el-table-column>
                </el-table-column>

            </el-table>
            <el-pagination background :current-page="queryObj.pageNo" :page-size="queryObj.pageSize" :page-sizes="[20, 50, 80, 100, 200, 500]" :total="total" :pager-count="7" layout="total, sizes, prev, pager, next, jumper" @current-change="changepageNo" @size-change="changePageSize"></el-pagination>
        </div>
    </div>
</template>

<script>
import { importCxfxExcel } from '@/api/cxtj/fxcx'
export default {
    name: 'qyfpmx',

    data() {
        return {
            loading: false,
            fieldsList: [
                {
                    label: '企业名称',
                    field: 'hymc',
                    type: 'text',
                    value: ''
                },
                {
                    label: '社会信用代码',
                    field: 'nsrsbh',
                    type: 'text',
                    value: ''
                },
                {
                    label: '税种',
                    field: 'sz',
                    type: 'select',
                    option: [],
                    value: ''
                },
                {
                    label: '优惠事项',
                    field: 'yhsx',
                    type: 'text',
                    value: ''
                },
                {
                    label: '优惠日期',
                    field: 'date',
                    type: 'daterange', // daterange
                    value: [],
                    options: [
                        {
                            field: 'dateQ',
                            value: ''
                        },
                        {
                            field: 'dateZ',
                            value: ''
                        }
                    ],
                    change: value => {
                        // this.changxm(value);
                    }
                }


            ],
            //右侧表格开始
            tableColumns: [
                {
                    label: '企业名称',
                    prop: 'qymc',
                    align: 'center',
                    // minWidth: 275,

                },
                {
                    label: '社会信用代码',
                    prop: 'nsrsbh',
                    align: 'center',

                },
                {
                    label: '税种',
                    prop: 'sz',
                    align: 'center',

                },
                {
                    label: '优惠事项',
                    prop: 'yhsx',
                    align: 'center',

                },
                {
                    label: '金额',
                    prop: 'je',
                    align: 'center',

                },
                {
                    label: '优惠日期起',
                    prop: 'yhrqq',
                    align: 'center',

                },
                {
                    label: '优惠日期止',
                    prop: 'yhrqz',
                    align: 'center',

                }




            ],
            tableDatas: []
            , queryObj: {
                qymc: '', //公司名称
                nsrsbh: '',
                yhsx: '',
                sz: '',
                yhrq: '',
                pageNo: 1,
                pageSize: 20
            },
            total: 0
        }
    },

    mounted() {
    },
    methods: {

        searchForm(params) {
            console.log(params, '查询条件');
            this.queryObj.qymc = params.qymc || '';
            this.queryObj.nsrsbh = params.nsrsbh || '';
            this.queryObj.fplx = params.fplx || '';
            this.queryObj.hwmc = params.hwmc || '';
            this.queryObj.bz = params.bz || '';
            this.queryObj.kprq = params.kprq || '';
            this.getTableData();
        },
        resetForm() {
            for (let key in this.queryObj) {
                if (key == 'pageNo') {
                    this.queryObj[key] = 1;
                } else if (key == 'pageSize') {
                    this.queryObj[key] = 20;
                } else if (key == 'frgsmc') {
                    this.queryObj[key] = '';
                } else {
                    this.queryObj[key] = [];
                }
            }
            this.getTableData();
        },
        getTableData() {

        },

        beforeUpload(file, fileList) {


            if (file.size > 1024 * 1024 * 10) {
                this.$message.warning(
                    "你上传的 \“" + file.name + "\” 文件过大，请上传小于2M的文件。"
                );
                return false;
            }

            if (
                file.name.indexOf("@") != -1 ||
                file.name.indexOf("#") != -1 ||
                file.name.indexOf('""') != -1 ||
                file.name.indexOf("<") != -1 ||
                file.name.indexOf(">") != -1 ||
                file.name.indexOf("?") != -1 ||
                file.name.indexOf("|") != -1 ||
                file.name.indexOf("/") != -1 ||
                file.name.indexOf(":") != -1 ||
                file.name.indexOf("`\`") != -1
            ) {
                this.$message.warning(
                    "你上传的 \“" +
                    file.name +
                    "\” 文件有特殊字符，文件名中不可存在特殊字符,请重新上传"
                );
                return false;
            }

            let index = file.name.lastIndexOf(".");
            let Type = file.name.substr(index + 1, file.name.length);
            if (["xls", "xlsx"].indexOf(Type.toLowerCase()) === -1) {
                this.$message({
                    type: "warning",
                    message: "请上传后缀名为xls, xlsx的附件！",
                });
                return false;
            }
        },
        httpRequest(data) {
            console.log(data);
            let fd = new FormData();
            fd.append("file", data.file);
            fd.append("id", this.uploadId);
            this.loading = true
            importCxfxExcel(fd).then((res) => {
                 this.loading = false
                if (res.code == 200) {
                    if (res.message == '导入成功') {
                        this.$message({
                            type: "success",
                            message: res.message,
                        });
                       this.go('wdtb')
                    } else {
                        this.$message({
                            type: "error",
                            message: res.message,
                        });
                    }


                }
            });
        },
        changepageNo(currPage) {
            this.queryObj.pageNo = currPage;
            this.getTableData();
        },
        changePageSize(pageSize) {
            this.queryObj.pageSize = pageSize;
            this.getTableData();
        },
        currIndex(index) {
            return (this.queryObj.pageNo - 1) * this.queryObj.pageSize + index + 1;
        },
        go(name, params) {
            this.$emit('changePage', name, params);
        },
    }
}
</script>

<style lang="scss" scoped>
.container {
    height: 100%;
    width: 100%;
    background-color: #fff;

    .searchMy {
        background: #fff;
        padding: 8px;
        position: relative;

        .tbImg {
            width: 28px;
            height: 28px;
            position: absolute;
            top: 7px;
            right: 0;
            cursor: pointer;

            img {
                width: 28px;
                height: 28px;
            }
        }

        .searchMy-form {
            height: 28px;
        }
    }

    .btn {
        padding: 8px 8px 8px 0;
    }

    .kplist {
        display: flex;
        justify-content: space-between;

        span {
            font-size: 14px;
            font-weight: normal;
            color: rgba(0, 0, 0, 0.56);
        }
    }
}

.el-pagination {
    text-align: right;
    padding: 8px 16px 8px 0;
    background: #fff;
}
</style>
